<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>个人测量</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
	<meta name="keywords" content="" />
	<meta name="description" content="" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<link rel="stylesheet" href="css/cui.css" />
	<link rel="stylesheet" href="css/lib.css" />
	<link rel="stylesheet" href="css/style.css" />
</head>
<body>

    <!-- 头部 -->
    <section id="hd">
        <div class="hdl"><a onclick="history.back()" class="a-back"></a></div>
        <h3>个人数据</h3>
    </section>
    <!-- 头部 end-->

    
        <!-- 主内容 -->
        <section id="bd">

            <div class="m-txt2">
                <p>个人数据 · 综合评估</p>
                <span>健　康</span>
            </div>
            <div class="m-txt3">
                <h3>具体数据</h3>
                <!-- 图表 -->
                <div id="m-data"></div>
                <!-- 图表 end-->
                <div class="txt">
                    <h4>健康寄语</h4>
                    <p>精神，就像是春风，冰河将因之解冻，枝头将因之泛新，花朵将因之绽放。振作精神，世界便会改观，阳光便会灿烂，胜利便会来到。</p>
                </div>
            </div>
        </section>
        <!-- 主内容 end-->
	


	<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
	<script type="text/javascript" src="js/lib.js"></script>

    <!-- 图表 -->
    <!--<script type="text/javascript" src="js/echarts.min.js"></script>-->
    <script src="http://cdn.bootcss.com/echarts/3.5.0/echarts.simple.min.js"></script>
    <script src="http://cdn.bootcss.com/axios/0.15.3/axios.min.js"></script>
    <script src="js/axios-config.js"></script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('m-data'));
        axios.student('/info')
            .then(function (res) {
                var data=res.data.Detail;
                axios.student('/referenceinfo')
                    .then(function (res) {
                        var ave=res.data.Detail;
                        var option = {
                            tooltip: {},
                            legend: {
                                data:['个人数据','平均数据']
                            },
                            xAxis: {
                                data: ["肺活量","50米跑","坐位体前屈","跳绳"],
                                axisLabel:{
                                    interval:0,
                                    rotate:30,//倾斜度 -90 至 90 默认为0
                                    margin: 10,
                                    textStyle:{
                                        fontSize: 12,
                                        fontWeight:"bolder",
                                        color:"#797979"
                                    }
                                }
                            },
                            yAxis: {},
                            series: [{
                                name: '个人数据',
                                type: 'bar',
                                data: [data.ScoreOfVitalCapacity, data.ScoreOfFityMeter, data.ScoreOfSitBack, data.ScoreOfRopeSkipe],
                                color: ['#03bfdc']
                            },{
                                name: '平均数据',
                                type: 'bar',
                                data: [ave.ScoreOfVitalCapacity, ave.ScoreOfFityMeter, ave.ScoreOfSitBack, ave.ScoreOfRopeSkipe],
                                color: ['#f7a14d']
                            }
                            ]
                        };
                        myChart.setOption(option);
                    })
            })
    </script>



</body>
</html>